<template>
<!--return_goods_list.wxml-->
<view class="container">
    <view v-for="(item, index) in list" :key="index" class="return-box">
        <view class="item">
            服务单号：{{item.id}}
            <text class="state">{{item.status_name}}</text>
        </view>
        <navigator class="item" :url="'/pages/user/return_goods_info/return_goods_info?id=' + item.id">
            <block v-if="item.status == -2">您的服务单已经取消</block>
            <block v-else-if="item.status == -1">很抱歉！您的服务单未通过审核</block>
            <block v-else-if="item.status == 0">您的服务单已申请成功，待售后审核中</block>
            <block v-else-if="item.status == 1">您的服务单已通过审核</block>
            <block v-else-if="item.status == 2">等待卖家签收</block>
            <block v-else-if="item.status == 3 || item.type == 2">卖家已收到您寄回的物品,卖家已重新发货</block>
            <block v-else-if="item.status == 5 || item.status == 4">您的服务单完成</block>
            <image class="wh100 arrow" src="/static/images/icon-arrowdown.png"></image>
        </navigator>
        <view class="item return-goods">
            <image class="wh100 goods_img" :src="url + '/api/goods/goodsThumImages?goods_id=' + item.goods_id + '&width=100&height=100'"></image>
            <view class="goods-desc">
                <view class="goods-name">{{item.goods_name}}</view>
                <view class="apply-time">申请时间：{{item.addTimeFommat}}</view>
            </view>
        </view>
        <navigator class="little-btn-1 foot-btn" :url="'/pages/user/return_goods_info/return_goods_info?id=' + item.id">进度查询</navigator>
        <view class="little-btn-1 foot-btn" :data-id="item.id" @tap="receiveOrder" :hidden="!(item.status==3&&item.type==2)">确认收货</view>
        <view class="little-btn-2 foot-btn" :data-id="item.id" @tap="cancelReturn" :hidden="!(item.status!=-2&&item.status<1)">取消申请</view>
    </view>
    <view class="no-data" v-if="!list || list.length == 0">
        <image src="/static/images/cart-null.png" class="cart-image"></image>
        <view class="no-data-title">没有找到相关的记录</view>
        <navigator url="/pages/index/index/index" class="lookat"> 去逛逛 </navigator>
    </view>
</view>
</template>

<script>
var app = getApp();
var request = app.globalData.request;
import LoadMore from "../../../utils/LoadMore";
var load = new LoadMore();
var util = require("../../../utils/util.js");

export default {
  data() {
    return {
      url: app.globalData.setting.url,
      resourceUrl: app.globalData.setting.resourceUrl,
      list: null,
      currentPage: 1
    };
  },

  components: {},
  props: {},
  onLoad: function () {
    var that = this;
    load.init(this, '', 'list');
    this.requestReturnGoods();
  },
  onShow: function () {
    if (uni.getStorageSync('user:return_goods_list:update')) {
      uni.setStorageSync('user:return_goods_list:update', false);
      this.resetData();
      this.requestReturnGoods();
    }
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {
    this.resetData();
    this.requestReturnGoods();
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
    if (load.canloadMore()) {
      this.requestReturnGoods();
    }
  },
  methods: {
    requestReturnGoods: function () {
      var that = this;
      var requestUrl = that.url + '/api/user/return_goods_list?p=' + that.currentPage;
      load.request(requestUrl, function (res) {
        that.currentPage++;
        res.data.result.forEach(function (val, index, arr) {
          val.addTimeFommat = util.formatTime(val.addtime);
        });
        uni.stopPullDownRefresh();
      });
    },
    resetData: function () {
      this.currentPage = 1;
      this.list = null;
      load.resetConfig();
    },

    /** 确认收货 */
    receiveOrder: function (e) {
      var that = this;
      var return_id = e.currentTarget.dataset.id;
      uni.showModal({
        title: '确定已收货？',
        success: function (res) {
          if (res.confirm) {
            request.post('/api/order/receiveConfirm', {
              data: {
                return_id: return_id
              },
              success: function (res) {
                that.resetData();
                that.requestReturnGoods();
              }
            });
          }
        }
      });
    },

    /** 取消退换货 */
    cancelReturn: function (e) {
      var that = this;
      var return_id = e.currentTarget.dataset.id;
      uni.showModal({
        title: '确定取消售后服务？',
        success: function (res) {
          if (res.confirm) {
            request.post('/api/order/return_goods_cancel', {
              data: {
                id: return_id
              },
              success: function (res) {
                that.resetData();
                that.requestReturnGoods();
              }
            });
          }
        }
      });
    }
  }
};
</script>
<style>
/* return_goods_list.wxss */
.return-box{
    background-color: white;
    margin: 0 auto;
    margin-bottom: 20rpx;
    font-size: 30rpx;
    width: 710rpx;
    border-radius: 10rpx;
}
.return-box:first-child {
    margin-top: 20rpx;
}

.item {
    padding: 20rpx 25rpx;
    border-bottom: 3rpx solid #f3f3f3;
    font-size: 28rpx;
}
.state{
    color: #ff6a00;
    float: right;
}
.arrow {
    margin-top: 5rpx;
    width: 25rpx;
    height: 28rpx;
    float: right;
}
.return-goods{
    height: 100rpx;
}
.goods_img{
    height: 100rpx;
    width: 100rpx;
    float: left;
}
.goods-desc{
    padding-left: 30rpx;
    width: 530rpx;
    float: left;
}
.goods-name{
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
    padding-bottom: 35rpx;
}
.apply-time{
    font-size: 26rpx;
    color: #999999;
}
.return-btn{
    float: right;
    border: 1rpx solid #f3f3f3;
    padding: 8rpx;
    border-radius: 3rpx;
    margin: 20rpx 25rpx;
}
.foot-btn{
  float: right;
  margin: 20rpx 25rpx 20rpx 0rpx;
}
</style>